<script>
  // 使用AI开发小程序

        // https://developer.open-douyin.com/docs/resource/zh-CN/mini-app/introduction/ai-mini-app-dev

        // 视频地址：  https://p9-arcosite.byteimg.com/obj/tos-cn-i-goo7wpa0wc/c49b41d4e22948c398d6080856952df1

        /*
            一、什么是使用AI开发小程序

                  使用AI开发小程序时指借助AI工具(如抖音开发者工具的 "AI智能调整"功能),通过自动化生成UI代码。智能调整界面细节、自动接入接口等方式，

                  快速完成轻量级小程序开发的过程，重点覆盖从UI设计到功能实现的全流程辅助。


                  1、使用场景：

                            主要适用于 "轻量级小程序快速开发场景"，例如：

                                <1>、工具类小程序 (如日常挑战任务记录、简单数据统计)

                                <2>、需快速验证需求的轻量应用 (如用户行为记录、成就系统展示)

                                <3>、开发者需高效完成UI设计与接头对接的场景 (如通过图片生成代码、智能调整元素细节)。

                  2、功能及价值

                                <1>、提升开发效率：   AI自动生成UI代码，智能调整页面(如字体大小、元素位置)，减少手动编码与调试时间

                                <2>、降低开发门槛：   通过自然语言指令 (如"字体调大"、"居中显示")即可修改代码，无需熟悉复杂语法。

                                <3>、增强功能准确性：  自定义规则自动接入接口 (如单词接入一个接口并更新文档状态)，减少人工错误；

                                <4>、支持快速验证：   通过AI辅助可快速完成开发与验证 (如检查页面显示、接口数据加载)，加速小程序上线
        */

        /*
            二、目标

                    本教程将介绍如何使用 AI 快速开发「今日挑战」小程序。

                    「今日挑战」是一款抖音小程序，核心功能为用户提供每日随机挑战任务并记录完成情况。主要包含两个页面：

                              1、今日挑战页：
                              
                                      展示当天随机生成的挑战任务（由服务端生成），用户可点击「完成挑战」按钮标记任务完成。

                              2、历史记录页：包含 3 个模块：

                                      ①、数据指标（）任务完成率、最长连续完成天数、总完成数量、总挑战数量）

                                      ②、本月记录（蓝色背景表示已完成，红色背景表示当天日期）

                                      ③、成就系统（展示用户获得的徽章）
        */

        /*
            三、开发工具准备

                      1、步骤一：创建项目

                              <1>.登录抖音开发者工具 IDE。

                              <2>、创建空项目（名称建议为challenge App），选择已有 App ID，开发模板选择「空白模板」。

                      2、步骤二：启用 AI 智能调整模式

                              <1>、入口一：通过工具栏的「AI 助手」面板打开。

                              <2>、入口二：通过模拟器顶部的「智能选择模式」入口打开（窗口居中，支持左右移动调整位置）。

                                若已打开对话面板，可点击「智能调整」Tab 切换至该模式。
        */

        /*
             四、接口接入与功能实现

                      1、步骤一：接口文档准备

                                将所有接口信息整理至API.md文档（包含接口描述、参数、返回值等）

                      2、步骤二：自定义规则自动接入

                                <1>、打开 AI 对话面板的「设置」→「自定义规则」→「编辑图标」，创建规则文件。

                                <2>、在规则中明确任务目标（如“将接口文档接入项目”）和约束条件：

                                          a.每次仅接入一个接口。

                                          b.接入完成后更新API.md中的接口状态（标记为“已完成”）。

                                          c.每完成一个接口后询问用户是否继续接入下一个接口（便于人工校验）。


                      3、步骤三：接口调试与优化

                                <1>、域名校验问题：本地调试阶段若使用 HTTP 接口，需关闭小程序的域名校验（避免请求报错）

                                <2>、图片显示问题：若接口返回的图标为文本而非图片路径，需在代码中调整显示方式（如使用icon字段替代image）。

                                <3>、功能验证：每次接入接口后，通过重新编译小程序检查数据是否正常加载（如历史记录页的指标更新、今日挑战页的任务显示）。

        */

        /*
              五、开发完成验证

                      1、检查今日挑战页：确认任务标题、图标、完成按钮显示正常，点击按钮可标记任务完成。

                      2、检查历史记录页：确认数据指标、本月记录（颜色标注）、成就徽章均正确展示。

                      3、验证接口功能：确保页面加载时自动请求服务端接口获取任务数据，任务完成后更新服务端状态
        */
</script>